<template>
  <a-drawer
    v-model:visible="vdata.visible"
    title="详情"
    :body-style="{ paddingBottom: '80px' }"
    width="40%"
    @close="onClose"
  >
    <a-row justify="space-between" type="flex">
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">基本信息</a-divider>
      <a-col :sm="24">
        <a-descriptions>
          <a-descriptions-item label="商户号">
            {{ vdata.detailData['mchNo'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="接收方绑定ID">
            {{ vdata.detailData['receiverId'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="应用APPID">
            {{ vdata.detailData['appId'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账状态">
            {{ vdata.detailData['state'] == 1?'正常分账':'暂停分账' }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="支付接口">
            {{ vdata.detailData['ifCode'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账比例">
            {{ vdata.detailData['divisionProfit'] * 100 }}%
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="绑定成功时间">
            {{ vdata.detailData['bindSuccessTime'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">账户信息</a-divider>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="接收方账号别名">
            {{ vdata.detailData['receiverAlias'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="账户类型">
            {{ vdata.detailData['accType'] == 0?'个人（对私）':'商户（对公）' }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账组ID">
            {{ vdata.detailData['receiverGroupId'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账组名称">
            {{ vdata.detailData['receiverGroupName'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账接收账号名称">
            {{ vdata.detailData['accName'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="分账接收账号">
            {{ vdata.detailData['accNo'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">账户参数信息</a-divider>
      <a-col :sm="24">
        <a-descriptions>
          <a-descriptions-item label="渠道账号参数">
            {{ vdata.detailData['channelAccNo'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="24">
        <a-descriptions>
          <a-descriptions-item label="绑定响应参数">
            {{ vdata.detailData['channelBindResult'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <!-- <a-col :sm="24">
        <a-descriptions>
          <a-descriptions-item label="渠道特殊信息">
            {{ vdata.detailData['channelExtInfo'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col> -->
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="创建时间">
            {{ vdata.detailData['createdAt'] }}
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
    </a-row>
  </a-drawer>
</template>

<script lang="ts" setup>
import { API_URL_DIVISION_RECEIVER, req } from '@/api/manage'
import {defineProps,reactive} from 'vue'
const props = defineProps({
  callbackFunc: { type: Function,default:null }
})

  const vdata:any = reactive({
      btnLoading: false,
      detailData: {}, // 数据对象
      recordId: null, // 更新对象ID
      visible: false, // 是否显示弹层/抽屉
  })

  function show (recordId) { // 弹层打开事件
    vdata.recordId = recordId
    req.getById(API_URL_DIVISION_RECEIVER, recordId).then(res => {
      vdata.detailData = res
    })
    vdata.visible = true
  }

  function onClose () {
    vdata.visible = false
  }
  
  defineExpose({
    show //抛出show函数给父组件
  })
</script>
